<template>
  <Card>
    <header>
      <span>产品类型:</span>
      <Select v-model="productType" @on-change="getVersion" style="width:200px">
        <Option v-for="item in productTypeData" :value="item.value" :key="item.value">{{ item.label }}</Option>
      </Select>
      <span style="width: 200px;margin-left: 30px;">版本号:</span>
      <Select v-model="version" style="width:200px">
        <Option v-for="item in versionData" :value="item.value" :key="item.value">{{ item.label }}</Option>
      </Select>
      <Button type="primary" @click="query" style="margin-left: 10px;">查询</Button>
      <Button type="primary" @click="turnPage('dkcpaddsmalliview')" style="margin-left: 10px;">新增</Button>
    </header>
    <Content style="margin-top:20px;">
      <Table border :columns="columns1" :data="data1"></Table>
    </Content>
    <div style="text-align:center;width:50%;margin:100px auto;">
      <Page :total="total2" :current="currentPage" :page-size="pageSize" show-elevator show-total @on-change="queryPage"></Page>
    </div>
  </Card>
</template>

<script>

export default {
  data () {
    return {
      gdh: '',
      currentSelect: '',
      productType: '',
      version: '',
      versionData: [],
      productTypeData: [],
      columns1: [
        {
          type: 'index',
          title: '序号',
          align: 'center'
        },
        {
          title: '版本号',
          align: 'center',
          render: (h, params) => {
            var vm = this
            return h('div', [
              h(
                'Button',
                {
                  props: {
                    type: 'primary',
                    size: 'small'
                  },
                  style: {
                    marginRight: '5px'
                  },
                  on: {
                    click: () => {
                      vm.$router.push({
                        name: 'dkcpsmalldetail',
                        query: {
                          version: params.row.productVersion,
                          productType: params.row.productType,
                          productTypeName: params.row.productTypeName
                          // editFlag: (params.row.isValid === "使用中")? 0 : 1
                        }
                      })
                    }
                  }
                },
                params.row.productVersion
              )
            ])
          }
        },
        {
          title: '产品类型',
          key: 'productTypeName',
          align: 'center'
        },
        {
          title: '状态',
          key: 'isValid',
          align: 'center'
        },
        {
          title: '操作',
          align: 'center',
          render: (h, params, index) => {
            var vm = this
            return h('div', [
              params.row.isValid === '使用中' &&
              h(
                'Button',
                {
                  props: {
                    type: 'primary',
                    size: 'small'
                  },
                  style: {
                    marginRight: '5px'
                  },
                  on: {
                    click: () => {
                      var param = {
                        id: params.row.id,
                        isValid: 1,
                        productType: params.row.productType,
                        mark: 'stop',
                        productVersion: params.row.productVersion
                      }
                      vm.updateById(param).then(re => {
                        params.row.isValid = '停用'

                        this.$Message.info(re.data.data)
                      })
                    }
                  }
                },
                '停用'
              ),
              params.row.isValid === '停用' &&
              h(
                'Button',
                {
                  props: {
                    type: 'primary',
                    size: 'small'
                  },
                  style: {
                    marginRight: '5px'
                  },
                  on: {
                    click: () => {
                      var param = {
                        id: params.row.id,
                        isValid: 0,
                        productType: params.row.productType,
                        mark: 'start',
                        productVersion: params.row.productVersion
                      }
                      vm.updateById(param).then(re => {
                        if (re.data.code === 'success') {
                          params.row.isValid = '使用中'
                        }

                        this.$Message.info(re.data.data)
                      })
                    }
                  }
                },
                '使用'
              ),
              h(
                'Button',
                {
                  props: {
                    type: 'error',
                    size: 'small'
                  },
                  on: {
                    click: () => {
                      var param = {
                        id: params.row.id,
                        deleteFlag: 1,
                        productType: params.row.productType,
                        productVersion: params.row.productVersion
                      }
                      if (!confirm('确认删除?')) {
                        return
                      }
                      vm.deleteById(param).then(re => {
                        let data1 = JSON.parse(JSON.stringify(vm.data1))
                        data1.splice(index, 1)
                        vm.data1 = data1
                      })
                    }
                  }
                },
                '删除'
              )
            ])
          }
        }
      ],
      data1: [],
      total2: null,
      currentPage: 1,
      pageSize: 10
    }
  },
  computed: {
    path () {
      return this.$route.path
    }
  },
  created () {
    var vm = this
    this.$ajax = this.$util.ajax()
    this.getVersion()
    vm.productTypeData.push({
      value: '',
      label: '请选择'
    })
    this.$ajax.post(vm.$appContext.marvels_core_product + '/product/mcpt/service/searchProduct', {}).then(re => {
      var allData = re.data.data
      for (var i = 0; i < allData.length; i++) {
        vm.productTypeData.push({
          value: allData[i].productType,
          label: allData[i].productTypeName
        })
      }
    })
    this.query()
    // api
    //   .searchProduct({
    //     productType: this.productType,
    //     version: this.version,
    //     pageSize: this.pageSize,
    //     currentPage: this.currentPage
    //   })
    //   .then(re => {
    //     this.data1 = re.data.data.list;
    //     this.total2 = re.data.data.count;
    //   })
    //   .catch(er => {});
  },
  methods: {
    query () {
      // console.log("111");
      var vm = this
      this.currentPage = 1
      this.$ajax.post(vm.$appContext.marvels_core_product + '/product/mcpt/service/searchProductVersion', {
        productType: this.productType,
        productVersion: this.version,
        currentPage: this.currentPage,
        pageSize: this.pageSize
      })
        .then(re => {
          this.data1 = re.data.data.list
          this.total2 = re.data.data.total
          this.currentPage = re.data.data.pageNum
        })
        .catch(er => { })
    },
    queryPage (n) {
      var vm = this
      this.$ajax.post(vm.$appContext.marvels_core_product + '/product/mcpt/service/searchProductVersion', {
        productType: this.productType,
        productVersion: this.version,
        pageSize: this.pageSize,
        currentPage: n
      })
        .then(re => {
          this.data1 = re.data.data.list
          this.total2 = re.data.data.total
          this.currentPage = re.data.data.pageNum
        })
        .catch(er => { })
    },
    updateById (params) {
      var vm = this
      return this.$ajax.post(vm.$appContext.marvels_core_product + '/product/mcpt/service/productUpdate', params)
    },
    turnPage (path) {
      var vm = this
      vm.$router.push(path)
    },
    deleteById (params) {
      var vm = this
      return this.$ajax.post(vm.$appContext.marvels_core_product + '/product/mcpt/service/productDelete', params)
    },
    getVersion () {
      var vm = this
      vm.versionData = []
      vm.versionData.push({ value: '', label: '请选择' })
      vm.version = ''
      this.$ajax.post(vm.$appContext.marvels_core_product + '/product/mcpt/service/searchVersion', { productType: vm.productType })
        .then(re => {
          for (var i = 0; i < re.data.data.length; i++) {
            this.versionData.push({
              value: re.data.data[i].productVersion + '',
              label: re.data.data[i].productVersion + ''
            })
          }
        })
        .catch(er => { })
    }
  }
}
</script>

<style lang="less">
.dkcp {
}
#addsmall {
  float: right;
  margin-right: 31px;
}
#addbig {
  float: right;
  margin-right: 10px;
}
</style>
